<template>
    <div class="roll-horizontally">
        <XScroll class="container">
            <div class="card-list">
                <div class="card" v-randomBgImg v-for="i in 7" :key="i">Card {{ i }}</div>
            </div>
        </XScroll>
    </div>
</template>

<script setup lang="ts">
import XScroll from "./XScroll.vue";
</script>

<style scoped lang="scss">
.container {
    width: 100%;
    height: 70vh;
    .card-list {
        display: flex;
        .card {
            width: 65vw;
            height: 70vh;
        }
    }
}
</style>
